// 做配置. 修改默认的脚手架中的webpack打包工具的配置, 实现覆盖内置的webpack 的配置

// 导入path模块, 该模块用来处理路径的
const path = require('path');
// path.join(路径1,路径2,...)  返回的是拼接好的相对路径地址
// path.resolve(路径1,路径2,...) 返回的是拼接好的绝对路径地址
//__dirname 表示当前该__dirname所处的文件的的绝对路径地址
// console.log('path', path);
// console.log('__dirname', __dirname);
// console.log('path.resolve(__dirname, src)', path.resolve(__dirname, 'src'));

module.exports = {
    webpack: {
        alias: { // 路径别名
            "@": path.resolve(__dirname, 'src') // 这样项目中就可以使用@符号表示src 目录地址
        }
    },
    style: { // 这是对style 样式做的配置
        postcss: {
            mode: "extends",
            loaderOptions: {
                postcssOptions: {
                    ident: "postcss",
                    plugins: [
                        [
                            "postcss-px-to-viewport-8-plugin",
                            {
                                // 设计稿的视口宽度,也就是ui设计师给你的设计图的大小,如果设计师给你的不是375,
                                // 使用ps 工具将其转成375px 大小
                                viewportWidth: 375,
                            },
                        ],
                    ],
                },
            },
        },
    }
}
